/* 
1 输入框绑定 值改变事件 input事件
  1 获取到输入框的值
  2 合法性判断 
  3 检验通过 把输入框的值 发送到后台
  4 返回的数据打印到页面上
2 防抖 （防止抖动） 定时器  节流 
  0 防抖 一般 输入框中 防止重复输入 重复发送请求
  1 节流 一般是用在页面下拉和上拉 
  1 定义全局的定时器id
 */

import { request } from "../../request/index.js";
// import regeneratorRuntime from '../../lib/runtime.js';

Page({
  data: {
    goods: [],
    //取消 按钮是否隐藏
    isFocus: false,
    //输入框的值
    inputValue: ""
  },
  TimeId: -1,
  //输入框的值改变就会触发的事件
  handleInput(e) {
    //1.获取输入框的值
    const { value } = e.detail;
    //2.检测合法性
    if (!value.trim()) {
      this.setData({
        goods: [],
        isFocus: false
      })
      //值不合法
      return;
    }
    //3.准备发送请求获取数据
    this.setData({
      isFocus: true
    })
    /* 防抖：每按下一个键，比如华为huawei,按h的时候，从头执行，
      来到这里清除上一个定时器，没有就算，再按u的时候，
      又重新执行，来到这行代码，又清除上一个定时器，即h开启的定时器，
      直到最后不按下任何键，过1秒之后执行里面的代码 */
    clearTimeout(this.TimeId);
    this.TimeId = setTimeout(() => {
      this.qsearch(value);
    }, 1000);

  },
  //发送请求获取搜索框建议 数据
  async qsearch(query) {
    const res = await request({ url: "/goods/qsearch", data: { query } });
    console.log(res);
    this.setData({
      goods: res
    })
  },
  //点击 取消 按钮
  handleCancel() {
    this.setData({
      inputValue: "",
      isFocus: false,
      goods: []
    })
  }
})